import { Form, Input, Row, Col } from 'antd';
import { axconst } from '@/shared/axconst';
import { AxValidator } from '../AxValidator';

const FormItem = Form.Item;
const { Search } = Input;
const {
  inlineFormItemLayout,
  inlineFormItemLayoutAllRowTwo,
  inlineFormItemLayoutAllRowThree,
} = axconst;
/**
 * 自定义CheckboxGroup
 * @param label 标签
 * @param field 字段名称
 * @param value 值
 * @param placeholder 占位符
 * @param hidden 是否隐藏
 */
export function AxSearch(props) {
  const {
    formItemClassName,
    formItemLayoutFromProps = null,
    wholerow,
    hidden,
    label,
    form,
    field,
    value,
    placeholder,
    required,
    validator,
    formItemStyle = null,
    loading = false,
    ...rest
  } = props;
  let formItemLayout = {};
  switch (wholerow) {
    case 'two':
      formItemLayout = { ...inlineFormItemLayoutAllRowTwo };
      break;
    case 'three':
      formItemLayout = { ...inlineFormItemLayoutAllRowThree };
      break;
    default:
      formItemLayout = formItemLayoutFromProps
        ? formItemLayoutFromProps
        : { ...inlineFormItemLayout };
      break;
  }
  const localProps = {
    autoComplete: 'off',
  };
  return hidden ? null : (
    <FormItem {...formItemLayout} label={label} style={formItemStyle} className={formItemClassName}>
      {form.getFieldDecorator(field, {
        initialValue: value,
        rules: [
          {
            label: props.label,
            required: props.required,
            validator: validator ? validator : AxValidator,
          },
        ],
      })(
        <Search
          placeholder={placeholder ? placeholder : `请选择${label}`}
          enterButton="选择"
          loading={loading}
          {...localProps}
          {...rest}
        />,
      )}
    </FormItem>
  );
}

/** 自定义 margin-bottom:0px 的显示标签 */
export const AxSearchNoMarginBottom = props => {
  return <AxSearch formItemClassName="ant-form-item-ax" {...props} />;
};
